<!DOCTYPE html>

<html>
<head>
	<title>For Test</title>
<script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
</head>
<body>
	<h2>this is for test only</h2>
	<div id='comment'>
		<ul>
		</ul>
	</div>
	<table>
		<tbody>
			<tr><td><input type='text' id='username'/></td></tr>
			<tr><td><textarea cols='50' rows='6' placeholder='comment here' id='commenttext'></textarea></td></tr>
			<tr><td><button id='submitcomment'>comment</button></td></tr>
		</tbody>
	</table>
		<script>
		$(function() {
		})
		$('table').on('click','button#submitcomment',function(){
			var name = $('input#username').val();
			var comment = $('textarea#commenttext').text();
			$('div#comment ul').append('<li>'+name + ': '+comment+'</li>');

			clearTB();
		});
		function clearTB () {
			$('input[type=text], textarea').val('');
		}
	</script>
</body>
</html>